<template>
   <div>
      <van-nav-bar  placeholder>
         <template #left>
            <a href="/cities">城市</a>
         </template>
         <template #title>
            <a href="/search" class="title">蹦蹦炸弹</a>
         </template>
         <template #right>
            <a v-if="!token || !userid" href="/login">登录</a>
            <span v-else href="/self">欢迎</span>
         </template>
      </van-nav-bar>
   </div>
</template>
<script lang='ts' setup>
import { ref } from 'vue';
const token = ref(localStorage.getItem('token'));
const userid = ref(localStorage.getItem('userid'));
</script>
<style lang="less" scoped>
div {

   width: 100%;
}

.van-nav-bar {
   background-color: red;
   position: absolute;
   top: 0;


   :deep(.van-nav-bar__title) {
      flex: 1;
      padding-left: 10px;
      line-height: 25px;
      background-color: #fff;
      border-radius: 50px;
      font-weight: normal;
      text-align: left;
      font-size: 12px;
   }
}
</style>